import Vue from 'vue'
import Vuex from 'vuex'
import student from "./student"

Vue.use(Vuex)

export default new Vuex.Store({
  // state 存放组件需要共享的数据
  state: {
    numA:999,
    person:[
      {name:"王二蛋",age:60},
      {name:"王铁柱",age:23}
    ]
  },
  // getters 类似于组建中的计算属性
  getters: {
    fmtNumA(state){
      return "***"+ state.numA + "元"
    },
    total(state){
      return 0;
    }
  },
  // 方法，类似于事件
  // 用于修改state中的数据(规范:只放同步代码)
  mutations: {
    addPerson(state,payload){
      // 预期: payload:{name:"老六",age:30}
      console.log("payload",payload);
      state.person.push(payload)

      // 发送请求   ！！！！！这里不能写异步代码
      // setTimeout(()=>{
      //   state.person.push(payload)
      // },3000)
    }
  },
  // 方法：类似于事件，与mutations类似
  // 区别：可以包含异步操作，它提交到mutations，不直接修改数据
  actions: {
    // context :{state:{},commit :fn}
    // let{commit} = {state:{},commit:fn} 对象解构
    asyncAddPerson({commit},payload){
      console.log("actions",payload);
      // 异步方式添加用户  setTimeout模拟 == axios请求
      setTimeout(()=>{
        // 提交（调用）mutations进行添加
        commit("addPerson",payload)
      },3000)
    }
  },
  // 2.定义模块
  modules: {
    student
  }
})
